<template>
	<view>
		<view class="swiperP">
			<u-swiper :height="350" :list="swiperList"></u-swiper>
		</view>
		<view class="contentP">
			<view class="infoP" @click="goMessageM">
				<image :style="{ width: '0.9rem', height: '0.9rem', marginRight: '0.5rem' }" src="../../style/image/home/xx.png"
				 alt="" />

				<view :style="{ fontSize: '0.65rem', fontWeight: '400' }">
					[设备升级通知]
				</view>
				<view :style="{
            fontSize: '0.65rem',
            marginLeft: '0rem',
            fontWeight: '300',
            fontFamily: 'PingFang SC',
            width: '10rem',
          }">
					<u-notice-bar :volume-icon="false" color="#878788" style="backgroundcolor: '#f6f6f6'" mode="vertical" :list="list"></u-notice-bar>
				</view>
				<view :style="{ fontWeight: '300', fontFamily: 'PingFang SC' }">>></view>
			</view>

			<view class="cell">
				<view @click="goIteM(item.id)" v-for="(item, index) in celList" :key="index" class="cell-item">
					<view>
						<!-- <image
              :style="{ width: '2.3rem', height: '2.3rem' }"
              :src="item.image"
              alt=""
            /> -->
						<image style="width: 2.3rem; height: 2.3rem" :src="item.imgUrl" alt=""></image>
					</view>
					<view :style="{ fontFamily: 'PingFang SC' }">{{ item.name }}</view>
				</view>
			</view>

			<view class="Title">
				<view class="myProlifIcon-title">
					<view class="myProlifIcon"></view>
					<view class="myProlifIcon-text">我的收益</view>
				</view>
				<view class="myProlifIcon-content">
					<view :style="{
              display: 'flex',
              justifyContent: 'center',
              alignItems: 'center',
            }">
						<view class="advance">可提现收益</view>
						<image @click="gowithDrawM" :style="{ width: '4rem', height: '1rem' }" src="../../style/image//home/ktxsy.png"
						 alt="" />
					</view>
					<view class="advance-number">{{ incomeData.ktxMoney }}</view>

					<view class="prolifyP">
						<view>
							<view class="prolifyP-item-title">累计收益(元)</view>
							<view class="prolifyP-item-number">{{
                incomeData.totalAmount
              }}</view>
						</view>

						<view :style="{
                width: '0.09rem',
                height: '3.03rem',
                background: '#F3F5F7',
              }"></view>

						<view>
							<view class="prolifyP-item-title">充电宝冻结收益(元)</view>
							<view class="prolifyP-item-number">{{
                incomeData.freezeMoney
              }}</view>
						</view>
					</view>
				</view>
			</view>

			<view class="Title">
				<view class="myProlifIcon-title">
					<view class="myProlifIcon"></view>
					<view class="myProlifIcon-text">更多功能</view>
				</view>
				<view class="myProlifIcon-func-content">
					<view :style="{ width: '50%', padding: '0.5rem' }">
						<image @click="goVirtualCode" :style="{ width: '100%', height: '6rem' }" src="../../style/image/home/mfzhsq.png"
						 alt="" />
					</view>
					<view :style="{ width: '50%', padding: '0.5rem' }">
						<image @click="goEmployeeM" :style="{ width: '100%', height: '6rem' }" src="../../style/image/home/A1.png" alt="" />
					</view>
				</view>
			</view>
		</view>

		<u-mask :show="maskShow" @click="show = false">
			<view class="warp" style="padding: 0rem 3rem; width: 100%">
				<view class="rect" @tap.stop>
					<view class="attesP">
						<image style="width: 100%; height: 15rem" src="../../style/image/attestation/renzheng.png" alt="" />
						<view style="
                width: 100%;
                position: absolute;
                display: flex;
                justify-content: center;
                bottom: -1rem;
              ">
							<view class="attes" @click="attesM">去认证</view>
						</view>

						<image @click="closeM" class="closeP" src="../../style/image/attestation/close.png" alt="" />
					</view>
				</view>
			</view>
		</u-mask>

		<u-toast ref="uToast" />

		<!-- <bar></bar> -->
	</view>
</template>

<script lang='ts'>
	import bar from "./topbar.vue";

	// import VConsole from "vconsole";
	// const vConsole = new VConsole();
	// import VConsole from 'vconsole'
	// const vConsole = new VConsole()

	//  import '../../utils/uniRequest'

	import {
		loginAPP
	} from "../../utils/api";

	import {
		loginAPPs,
		findHomeRollNewsList,
		myEarnings,
	} from "../../utils/uniApi";

	import {
		Component,
		Prop,
		Vue,
		Watch,
		Emit
	} from "vue-property-decorator";

	import uTabbar from "@/uview-ui/components/u-tabbar/u-tabbar.vue";

	@Component({
		name: "test",
		components: {
			bar,
		},

		//    components:{
		//      bar:()=>{ import('./topbar.vue') }
		//   }
	})
	export default class extends Vue {
		public swiperList: any = [
			// {
			//   image: "https://cdn.uviewui.com/uview/swiper/2.jpg",
			//   title: "身无彩凤双飞翼，心有灵犀一点通",
			// },
			// {
			//   image: require("../../style/image/home/lb.png"),
			//   title: "昨夜星辰昨夜风，画楼西畔桂堂东",
			// },

			// {
			//   image: require("../../style/image/home/lb.png"),
			//   title: "谁念西风独自凉，萧萧黄叶闭疏窗，沉思往事立残阳",
			// },
		];

		public list: any = [
			// '寒雨连江夜入吴',
			// '平明送客楚山孤',
			// '洛阳亲友如相问',
			// '一片冰心在玉壶'
		];

		public celList = [
			// {
			//   image: require("../../style/image/home/jzz.png"),
			//   title: "租借中",
			// },
			// {
			//   image: require("../../style/image/home/qbdd.png"),
			//   title: "全部订单",
			// },
			// {
			//   image: require("../../style/image/home/csjc.png"),
			//   title: "超时借出",
			// },
			// {
			//   image: require("../../style/image/home/fxhy.png"),
			//   title: "分享好友",
			// },
			// {
			//   image: require("../../style/image/home/wdsh.png"),
			//   title: "我的商户",
			// },
			// {
			//   image: require("../../style/image/home/wddl.png"),
			//   title: "我的代理",
			// },
			// {
			//   image: require("../../style/image/home/sbgm.png"),
			//   title: "设备购买",
			// },
			// {
			//   image: require("../../style/image/home/hysj.png"),
			//   title: "会员升级",
			// },
		];

		public obrandConfig = ''

		public incomeData: any = {
			freezeMoney: "", //	冻结金额
			totalAmount: "", //	总收益
			ktxMoney: "", //可提现金额
		};

		public maskShow = true;

		onShow() {
			this.incomeData = {}
			this.indexM()
		}

		created() {

			uni.getStorage({
				key: "userCard",
				success(e) {
					console.log(e, "card");
				},
			});

			if (
				uni.getStorageSync("userCard") == "" ||
				uni.getStorageSync("userCard") == null
			) {
				this.maskShow = true;
			} else {
				this.maskShow = false;
			}

			console.log(uni.getStorageSync("userCard"), "uni.getStorage");
		}

		onLoad() {
			console.log("你好");
			// uni.request({
			//     url: 'http://1t9294g931.iok.la:47376', // 请求接口
			//     // data: data, // 发送参数
			//     method:  'POST'|| 'GET', // 参数类型
			//     header: {
			//             "Content-Type": "application/x-www-form-urlencoded"
			//     }, // 请求头
			//     dataType: 'json', // 返回数据格式
			//     success(response) {

			// 		let datas=response.toString()

			// 		console.log(123132312321321321312)

			// 		uni.showModal({
			// 		    title: '提示',
			// 		    content: '111',
			// 		    success: function (res) {

			// 		    }
			// 		});
			//     },
			//     fail(error) {
			//     },
			//     complete(com) {
			//     }
			// })

			//   var fromData = new FormData();

			//   fromData.append("phone", "13627111557");
			//   fromData.append("password", "123456");
			//   fromData.append("loginStatus", "porxy");

			let params = {
				phone: "13627111557",
				password: "123456",
				loginStatus: uni.getStorageSync("otherData").porxyShop,
			};

			console.log("你好8");

			// loginAPPs(params).then((res:any) => {

			//        //  console.log('122234222665ss55w44',res.data)

			// 	   (this.$refs.uToast as any).show({
			// 	   							title: res.data.message,
			// 	   							type: 'success',
			// 	   							// url: '/pages/user/index'
			// 	   						})

			// 	   		// this.$refs.uToast.show({
			// 	   		// 					title: res.data.message,
			// 	   		// 					type: 'success',
			// 	   		// 					// url: '/pages/user/index'
			// 	   		// 				})

			// });
		}

		mounted() {

			this.indexM()
			
		}

		indexM() {

			let params = {
				userId: uni.getStorageSync("userId") == "" ?
					"" : parseInt(uni.getStorageSync("userId")),
			};
			findHomeRollNewsList(params).then((res: any) => {
				console.log("xiaoxX消息", res);
				res.data.data.filter((item: any, index: any) => {
					this.list.push(item.content);
				});
			});

			let paramss = {
				userId: uni.getStorageSync("userId") == "" ?
					"" : parseInt(uni.getStorageSync("userId")),
				loginStatus: "proxy", // 登录身份  proxy 代理  shop 商户
			};
			myEarnings(paramss).then((res: any) => {
				console.log("ressh收益", res);

				this.incomeData = res.data.data;
			});


			this.obrandConfig = uni.getStorageSync("otherData")


			var arr: Array < object >= uni.getStorageSync("otherData").obrandConfig.proxyHomeRollImgList

			arr.filter((item: any, index: any) => {

				let obj: object = {
					name: item.name == null ? '暂无' : item.name,
					image: item.imgUrl
				}

				this.swiperList.push(obj)

			})

			console.log(this.swiperList, ' this.swiperList this.swiperList this.swiperList')

			this.celList = uni.getStorageSync("otherData").obrandConfig.proxyHomeButtonList

			console.log(this.celList, 'this.celListthis.celList')

		}


		onPullDownRefresh() {
			console.log("refresh");

			this.indexM()



			setTimeout(function() {

				uni.stopPullDownRefresh();
			}, 1000);
		}

		gowithDrawM() {
			console.log("12332提现");
			uni.navigateTo({
				url: `../withdraw/index`,
			});
		}

		goVirtualCode() {
			console.log("VirtualCode");
			uni.navigateTo({
				url: "../../pages/item/virtualCode/virtualCode",
			});
		}

		goEmployeeM() {
			console.log("employee");

			uni.navigateTo({
				url: "../../pages/item/edit/myEmployee",
			});
		}


		attesM() {
			console.log("认证页面");
			uni.navigateTo({
				url: "../aiplay/atte",
			});
		}

		goMessageM() {
			console.log("123");

			uni.navigateTo({
				url: "./message",
			});
		}

		closeM() {
			this.maskShow = false;
		}

		goIteM(id: any) {
			if (id == 3) {
				uni.navigateTo({
					url: "../renting/index",
				});
			} else if (id == 40) {
				uni.navigateTo({
					url: "../order/allOrder",
				});
			} else if (id == 5) {
				uni.navigateTo({
					url: "../order/overtimeOrder",
				});
			} else if (id == 6) {
				uni.navigateTo({
					url: "../share/shareFirends",
				});
			} else if (id == 7) {
				uni.navigateTo({
					url: "../myPos/index",
				});
			} else if (id == 8) {
				uni.navigateTo({
					url: "../myAgent/index",
				});
			} else if (id == 9) {
				uni.navigateTo({
					url: "../buy/buy",
				});
			} else if (id == 10) {
				uni.navigateTo({
					url: "../item/membershipUp/index",
				});
			}
		}
	}
</script>

<style scoped lang='scss'>
	/deep/.u-notice-bar {
		padding: 9px 13px;
		background-color: #f6f6f6;
	}

	/deep/.u-mask {
		background-color: rgba(0, 0, 0, 0.6);
		z-index: 10070;
		transition: all 0.3s ease-in-out 0s;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		/*! width: 100%; */
		/*! align-items: center; */
	}

	.contentP {
		padding: 1rem;
		background-color: white;
	}

	.advance-number {
		text-align: center;
		font-size: 1.11rem;
		font-family: PingFang SC;
		font-weight: 300;
		color: #ff0000;
		padding: 1rem;
	}

	.prolifyP {
		display: flex;
		justify-content: space-evenly;
	}

	.Title {
		/* //  background-color: white; */
	}

	.prolifyP-item-title {
		text-align: center;
		height: 0.58rem;
		font-size: 0.6rem;
		font-family: PingFang SC;
		font-weight: 300;
		color: #343434;
		line-height: 1.06rem;
	}

	.prolifyP-item-number {
		margin: 1rem;
		height: 0.68rem;
		font-size: 1.2rem;
		font-family: PingFang SC;
		font-weight: 390;
		color: #000000;
		line-height: 1.4rem;
	}

	.infoP {
		padding: 0.3rem;
		background-color: #f6f6f6;
		border-radius: 0.3125rem;

		display: flex;
		align-items: center;
		justify-content: space-around;
	}

	.cell {
		display: flex;
		flex-wrap: wrap;
		padding: 1rem 0rem;
	}

	.cell-item {
		width: 25%;
		text-align: center;
		padding: 0.5rem 0rem;
		font-size: 0.625rem;
		color: #000000;
		font-family: PingFang SC;
	}

	.myProlifIcon-title {
		display: flex;
		align-items: center;
		margin: 1rem 0rem;
	}

	.myProlifIcon-text {
		/* // width: 20.84rem;
    // height: 49.09rem; */
		margin-left: 0.3rem;
	}

	.myProlifIcon-func-content {
		display: flex;
	}

	.myProlifIcon {
		width: 0.17rem;
		height: 0.84rem;
		background: #02b074;
		border-radius: 1rem;
	}

	.myProlifIcon-content {
		height: 9.5rem;
		background: #ffffff;
		box-shadow: 1rem 0.5rem 1rem 0.5rem rgba(154, 154, 154, 0.18);
		border-radius: 0.5rem;
		padding: 1rem;
	}

	.advance {
		font-size: 0.6rem;
		font-family: PingFang SC;
		font-weight: 300;
		color: #343434;
	}

	.attes {
		width: 8.95rem;
		height: 2.32rem;
		background: linear-gradient(198deg, #44ddb4, #02af74);
		border-radius: 1rem;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 1rem;
		color: white;

		/* position: absolute; */
		bottom: -1rem;
		text-align: center;
	}

	.attesP {
		position: relative;
		text-align: center;
		display: flex;
		justify-content: center;
	}

	.closeP {
		width: 1.5rem;
		height: 1.5rem;
		position: absolute;
		bottom: -5rem;
	}
</style>
